---
title: Introdução
description: Uma básica introdução ao Astro.
i18nReady: true
tableOfContents: false
editUrl: false
next: false
banner:
  content: |
    <a href="https://astro.build/blog/astro-4/">A versão 4.0 do Astro está aqui!</a>
    Pronto para atualizar? <a href="/pt-br/guides/upgrade-to/v4/">Leia nosso guia de atualização</a>.
hero:
  title: Documentação do Astro
  tagline: Guias, recursos e referências de API para te ajudar a construir com Astro.
  actions:
    - text: Começar
      icon: rocket
      link: /pt-br/install/auto/
      variant: primary
    - text: Leia sobre as funcionalidades do Astro
      icon: right-arrow
      link: /pt-br/concepts/why-astro/
  facepile:
    tagline: Possível graças ao Astro e nossos contribuidores de código aberto.
    linkText: Junte-se a nós!
    link: /pt-br/contribute/
---

import { CardGrid } from '@astrojs/starlight/components'
import Card from '~/components/Landing/Card.astro'
import ListCard from '~/components/Landing/ListCard.astro'
import SplitCard from '~/components/Landing/SplitCard.astro'
import Discord from '~/components/Landing/Discord.astro'

<CardGrid>
  <Card title="O que você vai construir com Astro?" icon="laptop">
    Explore [temas iniciais do Astro](https://astro.build/themes/) para blogs, portfólios, documentações, páginas iniciais, SaaS, marketing, sites de ecommerce e mais!
  </Card>

  <Card title="Faça um tour guiado" icon="star">
    Complete nosso tutorial introdutório [Construa um Blog](/pt-br/tutorial/0-introduction/) para aprender os fundamentos e criar seu primeiro site Astro.
  </Card>

  <SplitCard title="Comece um novo projeto" icon="rocket">
    ```sh
    # cria um novo projeto com npm
    npm create astro@latest
    ```
    
    Nosso [guia de instalação](/pt-br/install/auto/) tem instruções passo a passo para instalar o Astro usando nosso assistente de linha de comando, criar um novo projeto de um repositório Astro no GitHub e para instalar o Astro manualmente.
  </SplitCard>

  <ListCard title="Aprenda" icon="open-book">
    - [As principais funcionalidades do Astro](/pt-br/concepts/why-astro/)
    - [Arquitetura em ilhas](/pt-br/concepts/islands/)
    - [Componentes Astro](/pt-br/basics/astro-components/)
    - [A sintaxe de templates do Astro](/pt-br/basics/astro-syntax/)
  </ListCard>

  <ListCard title="Estenda" icon="puzzle">
    - [Adicione integrações como React e Tailwind](/pt-br/guides/integrations-guide/)
    - [Crie coleções de conteúdo com checagem de tipos](/pt-br/guides/content-collections/)
    - [Aprimore a navegação com transições de visualização](/pt-br/guides/view-transitions/)
    - [Conecte um CMS headless ao seu projeto](/pt-br/guides/cms/)
  </ListCard>
</CardGrid>

<Discord title="Tem alguma dúvida ou quer fazer parte?" cta="Entre em nosso Discord"/>
